<template>
	<view class="content">
		<view class="user_header flex flex-bt" style="align-items: flex-end;">
			<view class="flex-align flex" @click="go_url('/pages/setting/zh_xinxi')">
				<view class="user_header_img">
					<image :src="isLogin?data_user.headimg:'/static/logo1.png'" mode="" class="user_img"></image>
				</view>
				<view class="user_name" v-if="isLogin">
					<view class="user_id uni-font24" style="color:#333;margin-bottom: 6rpx;">昵称：{{data_user.nickname}}</view>
					<view class="user_id uni-font24">我的ID：{{data_user.id}}</view>
				</view>
				<view class="user_name" v-else>
					<view class="user_id uni-font24" style="color:#333;margin-bottom: 6rpx;font-size: 32rpx;">立即登录</view>
				</view>
			</view>
			
		</view>
		<view class="user_yao flex flex-align flex-bt ">
			<view class="left">
				<view class="wenzi">邀请好友加入</view>
				<view class="youhui uni-font24">享购物优惠</view>
			</view>
			<view class="right">
				<button class="uni-font24"  open-type="share" v-if="isLogin">立即邀请</button>
				<button class="uni-font24" v-if="!isLogin" @click="go_url">立即邀请</button>
			</view>
		</view>
		<view class="user_dingdan bg_wirte">
			<view class="dingdan_header flex flex-align flex-bt">
				<view class="left uni-bold">我的订单</view>
				<view class="right uni-font24 flex flex-align " @click="go_url('/pages/dingdan/dingdan?type=0')">查看全部 <tui-icon name="arrowright" color="#333" :size="24"></tui-icon></view>
			</view>
			<view class="dingdan_list flex uni-center">
				<view class="flex-1" @click="go_url('/pages/dingdan/dingdan?type=1')">
					<view><image src="../../static/my/daifukuan.png" mode=""></image></view>
					<view class="uni-font24">待付款</view>
				</view>
				<view class="flex-1" @click="go_url('/pages/dingdan/dingdan?type=2')">
					<view><image src="../../static/my/daifahuo.png" mode=""></image></view>
					<view class="uni-font24">待发货</view>
				</view>
				<view class="flex-1" @click="go_url('/pages/dingdan/dingdan?type=3')">
					<view><image src="../../static/my/daishouhuo.png" mode=""></image></view>
					<view class="uni-font24">待收货</view>
				</view>
				<view class="flex-1" @click="go_url('/pages/dingdan/dingdan?type=4')">
					<view><image src="../../static/my/yiwancheng.png" mode=""></image></view>
					<view class="uni-font24">已完成</view>
				</view>
			</view>
			
		</view>
		<view class="user_dingdan bg_wirte">
			<view class="dingdan_header flex flex-align flex-bt">
				<view class="left uni-bold">我的钱包</view>
				<view class="right uni-font24 flex flex-align " @click="go_url('/pages/wallet/wallet?type=1')">钱包明细 <text class="dian"></text> <tui-icon name="arrowright" color="#333" :size="24"></tui-icon></view>
			</view>
			<view class="user_qianbao flex flex-align flex-bt">
				<view class="left">
					<view class="price">￥<text>{{data_user.balance1||0.00}}</text></view>
					<view class="yue">账户余额</view>
				</view>
				<view class="right" @click="go_url('/pages/wallet/tixian')">去提现</view>
			</view>
		</view>
		<view class="user_gongju bg_wirte">
			<view class="left uni-bold">我的工具</view>
			<view class="gongju_list flex-align flex uni-center">
				<view class="list" @click="go_url('/pages/wallet/wallet?type=2')">
					<view>
						<image src="/static/my/userjifen.png" mode=""></image>
					</view>
					<view class="uni-font24">我的积分</view>
				</view>
				<view class="list" @click="go_url('/pages/user/youhuiquan')">
					<view>
						<image src="/static/my/youhuiquan.png" mode=""></image>
					</view>
					<view class="uni-font24">优惠券</view>
				</view>
				<view class="list" @click="go_url('/pages/notice/index')">
					<view>
						<image src="/static/my/notice.png" mode=""></image>
					</view>
					<view class="uni-font24">平台公告</view>
				</view>
				<view class="list">
					<view>
						<image src="/static/my/help.png" mode=""></image>
					</view>
					<view class="uni-font24">帮助与客服</view>
					<button open-type="contact" style="position: absolute;background: transparent;width: 100%;height: 100%;left: 0;top: 0">
						
					</button>
				</view>
				<view class="list" @click="go_url('/pages/setting/setting')">
					<view>
						<image src="/static/my/setting.png" mode=""></image>
					</view>
					<view class="uni-font24">设置</view>
				</view>
				<view class="list" @click="go_url('/pages/xieyi/xieyi_list')">
					<view>
						<image src="/static/my/xieyi.png" mode=""></image>
					</view>
					<view class="uni-font24">协议规则</view>
				</view>
				<view class="list" @click="go_url('/pages/address/address')">
					<view>
						<image src="/static/my/address.png" mode=""></image>
					</view>
					<view class="uni-font24">地址管理</view>
				</view>
			</view>
		</view>
		<tui-login :show="show"  @close="guanbi"></tui-login>
		<TabBar :tabBarShow="3"></TabBar>
	</view>
</template>

<script>
	import TabBar from '../../components/TabBar/TabBar.vue';
	export default {
		components: {
			TabBar
		},
		data() {
			return {
				data_user:'',
				level:'',
				dataBanner:'',
				is_renzheng:'',
				isLogin:false,
				show:false,
			}
		},
		onReady() {
			uni.hideTabBar();
		},
		onLoad() {

		},
		onShow() {
			let that = this
			that.isLogin = this.tui.isLogin()
			uni.$off('isShow');
			uni.$off('isLogin');
			uni.$on('isShow', function(data) {
				that.show = true
			});
			uni.$on('isLogin', function(data) {
				that.getData()
				that.isLogin = this.tui.isLogin()
			});
			that.getData()
		},
		onUnload() {
			/** 这里只保留最新的15条会话记录，以保证初次加载性能 */
			uni.$off('isShow');
			uni.$off('isLogin');
		},
		
		// #ifdef MP
		onShareAppMessage(res) {
		    if (res.from === 'button') {// 来自页面内分享按钮
		      console.log(res.target)
		    }
		    return {
		      title: '邀请好友',
			  // imageUrl:'/static/yingyang/banner.png',
		      path: '/pages/index/index?inviter_code='+this.data_user.inviter_code
		    }
		},
		// #endif
		
		methods: {
			guanbi(){
				this.show = false
			},
			go_url(e){
				console.log(e)
				let that = this
				if(that.tui.isLogin()){
					that.tui.href(e)
				}else{
					// that.tui.wetLogin()
					uni.reLaunch({
						url: '/pages/login/login'
					})
					// this.show = true
				}
			},
			getData(){
				let that = this
				that.tui.request("api.auth.center/get", "POST", {}, false, false, true).then((res) => {
					console.log(res)
					if(res.code==1){
						that.data_user = res.data.info
					}
				}).catch((res) => {
					that.is_btn = false
				})
			},
		}
	}
</script>

<style lang="scss">
	page{background: #f7f7f7;}
	.content{
		padding: 30rpx;
	}
	
	button::after{border: none;}
	.user_header{
		.user_header_img{position: relative;
			
		}
		.user_img{width: 100rpx;height: 100rpx;border-radius: 100%;}
		.user_name{padding-left: 20rpx;
			.user_id{color: #808080;}
		}
		text{font-size: 40rpx;}
	}
	.user_yao{
		background:linear-gradient(to right,#f5e7d4,#e9cba2);background-size: 100% 100%;padding: 30rpx 40rpx;margin-top: 50rpx;border-radius: 10rpx;
		.wenzi{color: #834921;margin-bottom: 10rpx;}
		.youhui{color: #977943;}
		.right{
			button{border-radius: 60rpx;background:linear-gradient(to bottom,#faecd8,#faecd8);color: #7a5124;}
		}
	}
	.user_dingdan{margin-top: 30rpx;padding: 30rpx 20rpx;border-radius: 10rpx;
		.dingdan_list{
			margin-top: 30rpx;
			text{font-size: 48rpx;}
			image{width: 70rpx;height: 70rpx;}
		}
		.dingdan_header{
			.right{
				text.dian{display: block;width: 15rpx;height: 15rpx;background: #f33b3b;border-radius: 100%;margin-left: 10rpx;}
			}
		}
		.user_qianbao{
			padding: 30rpx ;
			.price{
				text{font-weight: bold;font-size: 36rpx;}
			}
			.right{border-radius: 80rpx;line-height: 60rpx;width: 140rpx;text-align: center;background: #bce68e;color: #fff;}
		}
	}
	.uni-font24{color: #666666}
	.user_banner{margin-top: 50rpx;
		.user_img1{
			image{width: 690rpx;}
		}
		.user_img2{margin-top: -5rpx;
			image{width: 350rpx;margin-left: 10rpx;}
			image:first-child{margin-left: 0;}
		}
	}
	.user_gongju{margin-top: 30rpx;padding: 30rpx 20rpx;
		.gongju_list{flex-wrap: wrap;
			.list{width: 25%;margin-top: 30rpx;position: relative;
				text{font-size: 40rpx;}
				.uni-font24{color: #666666;}
				image{width: 43rpx;height: 43rpx;}
			}
		}
	}
</style>
